<script>
  import $ from 'dfish-widget'
  import Widget from '../Widget.vue'

  export default {
    mixins: [Widget],
    data() {
      return {
        name: 'SlidePicker',
        remark: '滑动选择器。主要用于移动端。',
        attrs: [{
          name: 'model-value / v-model',
          remark: '选中项的值',
          type: 'String',
        }, {
          name: 'option-height',
          remark: '选项高度',
          type: 'Number',
          default: '32',
        }, {
          name: 'min-value',
          remark: '最小值',
          type: 'Number',
          default: '',
        }, {
          name: 'max-value',
          remark: '最大值',
          type: 'Number',
          default: '',
        }, {
          name: 'keep-index',
          remark: '当选项发生变化时(option增加或减少)，选中项是否保留原来的位置',
          type: 'Boolean',
          default: '',
        },],
        slots: [{
          name: 'default',
          remark: '单个选项组件',
          option: 'Option'
        }],
        examples: [{
          remark: '鼠标按住拖动选择',
          type: 'html',
          view: true,
          code: `
              <w-slidepicker height=280>
                <w-option value="001" text="Atlanta"></w-option>
                <w-option value="002" text="Berlin"></w-option>
                <w-option value="003" text="Boston"></w-option>
                <w-option value="004" text="Chicago"></w-option>
                <w-option value="005" text="London"></w-option>
                <w-option value="006" text="Los Angeles"></w-option>
                <w-option value="007" text="New York"></w-option>
                <w-option value="008" text="Paris"></w-option>
                <w-option value="009" text="San Francisco"></w-option>
              </w-slidepicker>
            `
        },]
      }
    }
  }
</script>

<style>
</style>
